{% extends 'base.twig' %} 

{% block extraHead %}
<style>
.table { width: auto !important; }
.table td { {% if model.resortable == 1 %}cursor: move;{% endif %} }
</style>
{% endblock %} 

{% block contentContainer %}
<div class="example">
	<a href="{{ path('add-content', { modelName: model.name, returnURL: returnURL|url_encode }) }}">
		<button class="button success">
			<i class="fa fa-plus-circle"></i>&nbsp;&nbsp;Add new {{ model.name|lower }}
		</button>
	</a>
	
	{% if model._data|length > 0 %}
		<table class="table striped bordered hovered" style="margin-top: 5px;">
			<thead>
				<tr>
					{% if model.idField in meta %}
					<th class="text-left" style="width: 200px;">{% if model.resortable == 1 %}{{ model.idField }}{% else %}<a href="{{ path('contents-by-order', { modelName: model.name, page: 1, sort: model.idField, order: model._meta.order == 'ASC' ? 'DESC' : 'ASC' }) }}">{{ model.idField }}</a>{% endif %}</th>
					{% else %}
						{% for itm in model.columnsJson %}
							{% if (model.idField == itm.field) %}
							<th class="text-left" style="width: 200px;">{% if model.resortable == 1 %}{{ itm.name }}{% else %}<a href="{{ path('contents-by-order', { modelName: model.name, page: 1, sort: itm.field, order: model._meta.order == 'ASC' ? 'DESC' : 'ASC' }) }}">{{ itm.name }}</a>{% endif %}</th>
							{% endif %}
						{% endfor %}
					{% endif %}
					{% for itm in model.columnsJson %}
						{% if (itm.onList == 1 and model.idField != itm.field) %}
							<th class="text-left" style="width: 200px;">{% if model.resortable == 1 %}{{ itm.name }}{% else %}<a href="{{ path('contents-by-order', { modelName: model.name, page: 1, sort: itm.field, order: model._meta.order == 'ASC' ? 'DESC' : 'ASC' }) }}">{{ itm.name }}</a>{% endif %}</th>
						{% endif %}
					{% endfor %}
					{#<th class="text-left" style="width: 100px;">{% if model.resortable == 1 %}Added{% else %}<a href="{{ path('contents-by-order', { modelName: model.name, page: 1, sort: 'added', order: model._meta.order == 'ASC' ? 'DESC' : 'ASC' }) }}">Added</a>{% endif %}</th>
					<th class="text-left" style="width: 100px;">{% if model.resortable == 1 %}Modified{% else %}<a href="{{ path('contents-by-order', { modelName: model.name, page: 1, sort: 'lastModified', order: model._meta.order == 'ASC' ? 'DESC' : 'ASC' }) }}">Modified</a>{% endif %}</th>
					#}
					<th class="text-left" style="width: 60px;">&nbsp;</th>
				</tr>
			</thead>
			<tbody id="columns">
				{% for itm in model['_data'] %}
				<tr id="{{ itm.id }}">
					<td class="text-left" style="width: 200px;">{{ itm[model.idField] }}</td>
					{% for itm2 in model.columnsJson %}
						{% if (itm2.onList == 1 and model.idField != itm2.field) %}
						<td class="text-left" style="width: 200px;">
							{% if itm2.type.name|lower == 'checkbox' %}
							{{ itm[itm2.field] == 1 ? '<i style="color: green;" class="fa fa-check"></i>' : '<i style="color: red;" class="fa fa-times"></i>' }}
							{% else %}
							{{ itm[itm2.field] }}
							{% endif %}
						</td>
						{% endif %}
					{% endfor %}
					{#<td style="width: 100px;">{{ itm.added }}</td>
					<td style="width: 100px;">{{ itm.lastModified }}</td>
					#}
					<td style="width: 60px;">
					  <a href="{{ path('edit-content', { modelName: model.name, idValue: itm['slug'] != '' ? itm['slug'] : itm[model.idField]|url_encode, returnURL: returnURL|url_encode }) }}"><i class="fa fa-pencil"></i></a>
					  <a href="#" onclick="confirm(event); return false;" style="margin-left: 5px;"><i data-id="{{ itm['id'] }}" class="fa fa-times"></i></a>
					</td>
				</tr>
				{% endfor %}
			</tbody>
		</table>
	
		{% if model.resortable == 0 %}
		<div class="pagination" style="margin-top: 20px">
			<ul>
				<li class="first"><a href="{{ path('contents-by-order', { modelName: model.name, page: 1, sort: model._meta.sort, order: model._meta.order }) }}"><i class="icon-first-2"></i></a></li>
				<li class="prev"><a href="{{ path('contents-by-order', { modelName: model.name, page: max(1, model._meta.page - 1), sort: model._meta.sort, order: model._meta.order }) }}"><i class="icon-previous"></i></a></li>
				{% for i in 1..(model._meta.total / model.numPerPage)|ceil %}
					<li {% if i == model._meta.page %}class="active"{% endif %}><a href="{{ path('contents-by-order', { modelName: model.name, page: i, sort: model._meta.sort, order: model._meta.order }) }}">{{ i }}</a></li>
				{% endfor %}
				<li class="next"><a href="{{ path('contents-by-order', { modelName: model.name, page: min((model._meta.total / model.numPerPage)|ceil, model._meta.page + 1), sort: model._meta.sort, order: model._meta.order }) }}"><i class="icon-next"></i></a></li>
				<li class="last"><a href="{{ path('contents-by-order', { modelName: model.name, page: (model._meta.total / model.numPerPage)|ceil, sort: model._meta.sort, order: model._meta.order }) }}"><i class="icon-last-2"></i></a></li>
			</ul>
		</div>
		{% endif %}
	{% endif %}
</div>
{% endblock %} 

{% block extraFoot %}
<script>
	function confirm(ev) {
		ev.preventDefault();
		$.Dialog({
			overlay: true,
			shadow: true,
			title: 'Confirm',
			width: 500,
			onShow: function(_dialog){
				var content = _dialog.children('.content').css('text-align', 'center');
				content.html(
					'<div style="padding-top: 20px;">Click OK to continue<div>' +
					'<div style="padding-top: 50px;">' +
						'<button class="button primary ok">OK</button>&nbsp;' +
						'<button class="button" onclick="$.Dialog.close();">Cancel</button>' +
					'</div>'
				);
				$('.window .content .ok').on('click', function() {
					$.Dialog.close();
					$.ajax({
						type: 'POST',
						url: '{{ path('remove-content') }}',
						data: 'data=' + $(ev.target).data('id') + '&modelName={{ model.name }}',
						success : function(msg) {
							location.reload();
						}
					});
				});
			}
		});
	}
</script>

{% if model.resortable == 1 %}
<script>
	$(function() {
		$('#columns').sortable({
			stop: function( event, ui ) {
				$.ajax({
					type: 'POST',
					url: '{{ path('sort-contents') }}',
					data: 'data=' + encodeURIComponent(JSON.stringify($('#columns').sortable("toArray"))),
					success : function(msg) {}
				});
			}
		})
	});
</script>
{% endif %}
{% endblock %}
